import {Component, OnInit} from '@angular/core';
import {HttpService} from "../share/http.service";
import {url} from '../share/url';
import {flyIn} from "../animations/flyIn";

@Component({
  moduleId: module.id,
  selector: 'my-system_focus',
  templateUrl: 'system_focus.component.html',
  animations: [
    flyIn
  ]
})

export class system_focusComponent implements OnInit {
  public getTeamDetailUrl: string = url.url + '/app2/web/page';
  public imageUploadUrl: string = url.url + '/app2/upload';
  public staffInfoUploadUrl: string = url.url + '/app2/web/manage/staff/add';
  public staffGetListUrl: string = url.url + '/app2/web/staff/list';
  public staffDeletaUrl: string = url.url + "/app2/web/manage/staff/delete";
  public getTeamDetailParams: object = {page: 'team'};
  public showBoolean: boolean = false;//用来控制模态框的显示与否
  public richText: string;//表示该富文本的内容
  public onlyOne: string = 'needOne';//控制页面的富文本编辑器的数量
  public teamAdvantageUnique: string = 'teamsAdvantage';
  public teamAdvantageImage: any = [];
  public imageUploadUnique:any={};
  public theads: Array<any> = ["名字", "职位", "操作"];
  public teamAdvantageToModel: any;
  //用来控制页面上的双向绑定
  public staffInfo: any = {staffName: '', job: ''};
  public staffInfoLists: any;
  public showImageUpload: boolean = true;
  public show: boolean = true;
  public showAddStaff: boolean = false;

  constructor(private http: HttpService) {
  }

  ngOnInit() {
    this.http.httpGet(this.getTeamDetailUrl, this.getTeamDetailParams)
      .subscribe((res) => {
        console.log(res);
        // let value = res.results.pagehtmls[0];
        // this.teamAdvantageToModel = value;
        this.show = true;
        this.richText = JSON.stringify(res.results);
        console.log(this.richText);
        // this.teamAdvantageImage = value.images;
      });
    this.http.httpGet(this.staffGetListUrl, {})
      .subscribe((res) => {
        console.log(res);
        this.staffInfoLists = res.results.staffs
      })
  }

  staffClose() {
    this.showAddStaff = false;
  }

  addStaff() {
    this.staffInfo = {staffName: '', job: ''};
    this.showAddStaff = true
  }

  modifyStaffIntro() {

    this.showBoolean = true;
  }

  editStaff(index) {
    console.log(index);
    let value = this.staffInfoLists.filter(res => res.id ===index);
    console.log(value);
    this.staffInfo ={staffName:value[0].staffName,job:value[0].job};
    this.showAddStaff = true;
    this.ngOnInit()
  }

  deleteStaff(index) {
    if(confirm("是否删除")){
      this.http.httpDelete(this.staffDeletaUrl, {id: index})
        .subscribe((res) => {
          console.log(res);
          this.ngOnInit()
        })
    }
  }

  comeFromModalBoolean(event: boolean) {
    this.showBoolean = event;
    this.ngOnInit()
  }


  staffSubmit() {
    // let fileInput = <HTMLInputElement>document.getElementById('file1');
    // formData.append("myfile", fileInput.files[0],fileInput.files[0].name);
    // console.log(fileInput.files[0].name);

    // console.log(files[0]===undefined);

    // if(files[0]!==undefined && this.staffInfo.staffName!=''&&this.staffInfo.job!=''){
    //
    //   this.showAddStaff = false;
    // }else {
    //   alert("请填写内容")
    // }
    let value = {
      job: this.staffInfo.job,
      staffName: this.staffInfo.staffName,
      photo: this.imageUploadUnique.photo,
      photoName: this.imageUploadUnique.photoName
    };
    console.log(value);
    if(this.staffInfo.staffName!=="" && this.staffInfo.job!==""){
      this.http.httpPost(this.staffInfoUploadUrl, value)
        .subscribe((res) => {
          console.log(res);
        });
      this.ngOnInit();
    }else{
      alert("内容不能为空")
    }
  }

  uploadStaffInfo(data,name) {

  }

  imageUploadChange(){
    let files = $("#file1").prop('files');
      this.imageUploadUnique.photoName= files[0].name;
      let formData = new FormData();
      let imagePath:string = "";
      formData.append("file", files[0]);
      $.ajax({
        url: this.imageUploadUrl,
        type: "POST",
        data: formData,
        /**
         *必须false才会自动加上正确的Content-Type
         */
        contentType: false,
        /**
         * 必须false才会避开jQuery对 formdata 的默认处理
         * XMLHttpRequest会对 formdata 进行正确的处理
         */
        processData: false,
        success: (data) => {
          // var jsonObj = $.parseJSON(data)
          this.imageUploadUnique.photo = data.results.path;
        },
        error: function () {
          console.log(files[0] == null);
          alert("没有图片上传！");
          // $("#imgWait").hide();
        }
      });
  }
}
